import { Component, Input, OnInit, Output, EventEmitter } from '@angular/core';
import { NzContextMenuService, NzDropdownMenuComponent } from 'ng-zorro-antd/dropdown';
import { NzModalService } from 'ng-zorro-antd/modal';
import { ExceptionHandler } from 'src/app/handler/exception.handler';
import { RoleService } from 'src/app/services/role.service';
import { G6GraphTool } from '../treeGraph';

@Component({
  selector: 'zepride-department-and-role',
  templateUrl: './department-and-role.component.html',
  styleUrls: ['./department-and-role.component.less']
})
export class DepartmentAndRoleComponent implements OnInit {
  curTabIndex = 0;
  roles = [];
  private _departmentList = [];
  @Input() set departmentList(value) {
    this._departmentList = value;
    if (this._departmentList && this._departmentList.length) {
      this.curDepartment = this._departmentList[0];
      this.departmentSelectChanged.emit(this.curDepartment);
    }
  };

  get departmentList() {
    return this._departmentList;
  }
  @Output() departmentSelectChanged = new EventEmitter<any>();
  @Output() roleSelectChanged = new EventEmitter<any>();
  @Output() modeChanged = new EventEmitter<any>();
  @Output() roleValueChanged = new EventEmitter<any>();
  curDepartment;
  curRole;

  constructor(
    private roleSvr: RoleService,
    private nzContextMenuService: NzContextMenuService,
    private modal: NzModalService
  ) { }

  async ngOnInit() {
    await this.getRoles();
    if (this.roles.length) {
      this.curRole = this.roles[0];
      this.roleSelectChanged.emit(this.curRole);
    }
  }

  async tabChanged(index) {
    this.curTabIndex = index;
    if (this.curTabIndex == 1) {
      await this.getRoles();
      this.roleSelectChanged.emit(this.curRole);
    }

    this.modeChanged.emit(index == 0 ? 'department' : 'role');

    G6GraphTool.current.clean();
  }

  async addRole() {
    try {
      let orgId = localStorage.getItem('orgid');
      let r = await this.roleSvr.createRole({
        name: `角色${this.roles.length + 1}`,
        organizationId: orgId,
        permits: []
      });
      this.roles.push(r);

      this.roleValueChanged.emit(this.roles);
    } catch (error) {
      ExceptionHandler.current.handleError(error);
    }
  }

  async getRoles() {
    try {
      let r = await this.roleSvr.queryRoles();
      this.roles = r.list;
      this.roleValueChanged.emit(this.roles);
    } catch (error) {
      ExceptionHandler.current.handleError(error);
    }
  }

  contextMenu($event: MouseEvent, menu: NzDropdownMenuComponent): void {
    this.nzContextMenuService.create($event, menu);
  }

  closeMenu(): void {
    this.nzContextMenuService.close();
  }

  rename(item) {
    item.isEdit = true;
  }

  cancelRename(item) {
    item.isEdit = false;
  }

  async delRole(item) {
    try {
      this.modal.confirm({
        nzTitle: `提示信息`,
        nzContent: `是否要删除角色【${item.name}】！`,
        nzOkText: '删除',
        nzOkType: 'danger',
        nzOnOk: async () => {
          try {
            await this.roleSvr.deleteRole(item.id);
            let index = this.roles.findIndex(x => x.id == item.id);
            this.roles.splice(index, 1);
          } catch (error) {
            ExceptionHandler.current.handleError(error);
          }
        },
        nzCancelText: '取消',
        nzOnCancel: () => { }
      });

    } catch (error) {
      ExceptionHandler.current.handleError(error);
    }
  }

  async renameOk(item) {
    try {
      await this.roleSvr.updateRole(item);
      item.isEdit = false;
    } catch (error) {
      ExceptionHandler.current.handleError(error);
    }
  }

  selectDepartment(item) {
    this.curDepartment = item;
    this.departmentSelectChanged.emit(item);

    G6GraphTool.current.clean();
  }

  selectRole(item) {
    this.curRole = item;
    this.roleSelectChanged.emit(item);

    G6GraphTool.current.clean();
  }
}
